<template>
    <!-- 危大工程管控计划列表 -->
    <base-breadcrumb>
        <searchData :searchData="searchOptions" @search="handleSearch" />
        <div class="page-body">
            <a-card :bordered="false">
                <title-name title="危大工程管控清单" />
                <div class="table-operateors mb20">
                    <a-button type="primary" @click="handleUpdate('add')" icon="plus" v-btnPermission="'hse_008_add_01'"
                        >新增上报</a-button
                    >
                </div>
                <div class="pub-table-select-count">
                  <a-icon type="info-circle" theme="twoTone"/>
                  <span style="margin-right: 12px"> 危大工程管控计划总数：
                    <span class="totalNum">{{totalDetails.total}}</span> 个  |
                    待提交审核 <span class="totalNum">{{totalDetails.draft}}</span> 个  |
                    审核中 <span class="totalNum">{{totalDetails.submitted}}</span> 个  |
                    审核通过 <span class="totalNum">{{totalDetails.past}}</span> 个  |
                    审核不通过 <span class="totalNum">{{totalDetails.rejected}}</span> 个
                  </span>
                </div>
                <s-table
                    ref="table"
                    size="default"
                    rowKey="id"
                    :columns="columns"
                    :data="loadData"
                    :alert="true"
                    show-size-changer
                    show-quick-jumper
                    showPagination="auto"
                >
                    <!-- <template slot="auditStatus" slot-scope="text, record">
                        <StatusDisplay :status-code="record.auditStatus" />
                    </template> -->
                    <span slot="sort" slot-scope="text, record, index">{{ index + 1 }}</span>
                    <span slot="auditStatus" slot-scope="text, record">
                        <list-status :isApproval="true"  :status="record.auditStatus" conversion="en" :text="text"></list-status>
                    </span>
                    <a slot="businessVersion" slot-scope="text, record" @click="handleOpen(record)">{{
                        record.businessVersion ? 'V' + record.businessVersion : ''
                    }}</a>
                    <template slot="operator" slot-scope="text, record">
                        <a class="base-btn" @click="handleUpdate('look', record)" v-btnPermission="'hse_008_loo_04'"
                            >查看</a
                        >
                        <a-divider
                            v-if="record.auditStatus != 'SUBMITTED' && record.auditStatus != 'PAST'"
                            type="vertical"
                            v-btnPermission="'hse_008_loo_04'"
                        />
                        <a
                            v-if="record.auditStatus != 'SUBMITTED' && record.auditStatus != 'PAST'"
                            class="base-btn"
                            @click="handleUpdate('edit', record)"
                            v-btnPermission="'hse_008_edi_02'"
                            >编辑</a
                        >
                        <a-divider
                            v-if="record.auditStatus == 'DRAFT'"
                            type="vertical"
                            v-btnPermission="'hse_008_loo_03'"
                        />
                        <a
                            v-if="record.auditStatus == 'DRAFT'"
                            class="base-btn"
                            @click="handleUpdate('del', record)"
                            v-btnPermission="'hse_008_edi_03'"
                            >删除</a
                        >
                        <a-divider
                            v-if="record.auditStatus == 'PAST'"
                            type="vertical"
                            v-btnPermission="'hse_008_loo_04'"
                        />
                        <a
                            v-if="record.auditStatus == 'PAST'"
                            class="base-btn"
                            @click="handleUpdate('edit', record)"
                            v-btnPermission="'hse_008_moi_06'"
                            >更新版本</a
                        >
                        <a-divider
                            v-if="record.auditStatus && record.auditStatus !== 'DRAFT'"
                            type="vertical"
                            v-btnPermission="'hse_008_moi_05'"
                        />
                        <a
                            v-if="record.auditStatus && record.auditStatus !== 'DRAFT'"
                            @click="toggleApprovalDetails(record)"
                            v-btnPermission="'hse_008_moi_05'"
                            >审批信息</a
                        >
                    </template>
                </s-table>
            </a-card>
        </div>
        <div>
            <dialog-edit
                :visible.sync="visible.version"
                :versionData="versionData"
                pathName="UpdateProjectControl"
            ></dialog-edit>
        </div>
        <ApprovalDetails
            :visible="visible.approvalDetails"
            :businessId="childInitData.businessId"
            @cancel="visible.approvalDetails = false"
            @confirm="visible.approvalDetails = false"
        />
    </base-breadcrumb>
</template>

<script>
import ApprovalDetails from '@/components/approvalDetails'
import StatusDisplay from '@/components/StatusDisplay'
import { getControlPlanList, deleteControlPlan, getControlPlanCount } from '@/api/safetySupervision/projectControlPlan.js'
import { STable } from '@/components'
import dialogEdit from './VisionHistory' // 版本详情
import SelectSubCompany from '@/components/Select/SelectSubCompany' // 分公司
import SelectProject from '@/components/Select/SelectProject' // 项目
import OrgTreeSelect from '@/components/OrgTreeSelect'
import Vue from 'vue'
import { typeListApproval } from '@/utils/util'
const searchOptions = [
    // {
    //     name: '所属分公司',
    //     valueKey: 'branchComId',
    //     type: SelectSubCompany,
    // },
    {
          name: '所属单位',
          valueKey: 'searchQuery',
          type: OrgTreeSelect,
        },
    // {
    //     name: '所属项目',
    //     keyValue: 'branchComId',
    //     valueKey: 'projectId',
    //     type: SelectProject,
    // },
    {
        name: '填报人',
        value: 'creatorName',
        type: 'input',
    },
    {
        name: '填报时间',
        value: 'applyTime',
        type: 'dateRange',
    },
    {
        name: '状态',
        value: 'auditStatus',
        type: 'select',
        data: typeListApproval,
    },
]


const columns = [
        {
        title: '序号',
        dataIndex: 'sort',
        scopedSlots: { customRender: 'sort' },
    },
    {
        title: '所属分公司',
        dataIndex: 'branchComName',
    },
    {
        title: '所属项目',
        dataIndex: 'projectName',
    },
    {
        title: '填报人',
        dataIndex: 'creatorName',
    },
    {
        title: '填报时间',
        dataIndex: 'createTime',
    },
    {
        title: '版本信息',
        dataIndex: 'businessVersion',
        scopedSlots: { customRender: 'businessVersion' },
    },
    {
        title: '状态',
        dataIndex: 'auditStatus',
        scopedSlots: { customRender: 'auditStatus' },
    },
    {
        title: ' 操作',
        dataIndex: 'operator',
        scopedSlots: { customRender: 'operator' },
    },
]
export default {
    name:'a'+Date.now(),    components: {
        STable,
        StatusDisplay,
        ApprovalDetails,
        dialogEdit,
    },
    data() {
        return {
            totalDetails: {
              total: 0,
              draft: 0,
              submitted: 0,
              past: 0,
              rejected: 0
            },
            childInitData: {},
            visible: {
                approvalDetails: false,
                version: false,
            },
            searchOptions: searchOptions,
            columns: columns,
            queryParam: {},
            versionData: [],
            loadData: async (parameter) => {
                const requestParameters = Object.assign({}, parameter, this.queryParam)
                this.getControlPlanCount(requestParameters)
                const [err, res] = await getControlPlanList(requestParameters)
                return new Promise((resolve, reject) => {
                    if (err) {
                        reject(err)
                    } else {
                        resolve(res)
                    }
                })
            },
        }
    },
    methods: {
        toggleApprovalDetails(data) {
            this.childInitData = { ...data }
            this.visible.approvalDetails = true
        },
        /**
         * 查看历史版本
         */
        handleOpen(e) {
            this.versionData = e.histories
            this.visible.version = true
        },
        handleSearch(val = {}) {
            this.queryParam = {
                ...val,
                beginDate: (val.applyTime && val.applyTime.length && val.applyTime[0].format('YYYY-MM-DD')) || void 0,
                endDate: (val.applyTime && val.applyTime.length && val.applyTime[1].format('YYYY-MM-DD')) || void 0,
            }
            this.$refs.table.refresh(true)
        },
        async getControlPlanCount(param) {
          const [err, res] = await getControlPlanCount(param);
          if (!err) {
            this.totalDetails = res.data;
          }
        },
        async deleteControlPlan(data) {
            const [err, res] = await deleteControlPlan({ id: data.id })
            if (!err) {
                this.$message.success('成功')
                this.$refs.table.refresh(true)
            }
        },
        // 处理更新操作（新增、编辑）
        handleUpdate(type, data = {}) {
            if (type == 'del') {
                let that = this
                this.$confirm({
                    title: '温馨提示',
                    content: '确定是否删除数据？',
                    okText: '确认',
                    okType: 'danger',
                    cancelText: '取消',
                    onOk: () => {
                        return that.deleteControlPlan(data)
                    },
                })
            } else {
                this.$router.push({
                    name: 'UpdateProjectControl',
                    query: {
                        pageType: type,
                        id: data.id || '',
                    },
                })
            }
        },
        handleGetThemes(data) {
            console.log(data)
            console.log('zzz', this.formInfo.getFieldsValue())
        },
    },
}
</script>

<style lang="less" scoped>
.page-header {
    .header-row {
        display: flex;
        .flex-content {
            flex: auto;
        }
        .divider {
            margin: 0 12px;
        }
        .expand-btn {
            margin-left: 8px;
            font-size: 14px;
        }
    }
}
.page-body {
    .table-operateors {
        .ant-btn + .ant-btn {
            margin-left: 12px;
        }
    }
}
</style>